<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <title>达梦数据管理平台</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="shortcut icon" th:href="@{/img/favicon.png}"/>
    <link rel="stylesheet" th:href="@{/js/layui/css/layui.css}"/>
    <link rel="stylesheet" th:href="@{/js/ztree/css/zTreeStyle/zTreeStyle.css}" type="text/css"/>
    <link rel="stylesheet" th:href="@{/iconfont/iconfont.css}"/>
    <link rel="stylesheet" th:href="@{/css/adminAntDesign.css}"/> <!--/*--> 主题样式引入，不要随意增加修改删除 <!--*/-->
    <link rel="stylesheet" th:href="@{/css/adminCss.css}"/><!--/*--> 后台样式风格，可以增加样式 <!--*/-->
</head>
<body>
    <div class="layui-layout layui-layout-admin">
        <div th:replace="inc/top :: index_top"></div>
        <div th:replace="inc/menu :: index_menu"></div>
        <div class="layui-body">
            <iframe th:src="@{/img/welcome.png}" class="layadmin-iframe"></iframe>
        </div>
    </div>
    <form action="#" id="pwdForm" class="layui-form" style="display: none">
        <blockquote class="layui-elem-quote layui-text">
            修改密码后立即生效，如果忘记密码请联系管理员！
        </blockquote>
        <div class="layui-form-item layui-col-xs6">
            <label class="layui-form-label">密码：</label>
            <div class="layui-input-block" style="width:330px;">
                <input type="password" name="pwd" id="pwd" class="layui-input" lay-verify="required" autocomplete="off" placeholder="请输入密码">
            </div>
            <font style="color:red;float: right;margin-top: -30px;">*</font>
        </div>
        <div class="layui-form-item layui-col-xs6">
            <label class="layui-form-label">确认密码：</label>
            <div class="layui-input-block" style="width:330px;">
                <input type="password" id="pwd1" class="layui-input" lay-verify="required|confirmPass" autocomplete="off" placeholder="请再次输入密码">
            </div>
            <font style="color:red;float: right;margin-top: -30px;">*</font>
        </div>
        <button type="submit" class="layui-btn" lay-submit lay-filter="changePwd" style="display:none;"></button>
    </form>
</body>
<script type="text/javascript" th:src="@{/js/jquery-3.4.1.min.js}"></script>
<script type="text/javascript" th:src="@{/js/ztree/js/jquery.ztree.core.min.js}"></script>
<script type="text/javascript" th:src="@{/js/layui/layui.all.js}" charset="utf-8"></script>
<script type="text/javascript" th:src="@{/js/common.js}"></script>
<script type="text/javascript" th:inline="javascript">
    /*<![CDATA[*/
    var ctxPath = /*[[@{/}]]*/ '';
    /*]]>*/
    var layer, indexo;

    ;!function(){
        layer = layui.layer;
        var element = layui.element,
            form = layui.form;

        //初始化菜单
        $.ajax({
            url: ctxPath + 'getMenu',
            type: 'post',
            success: function(data){
                var str = '';
                $.each(data, function(index, el) {
                    if(index == 0){
                        //初始化第一个菜单高亮
                        str+='<li class="layui-nav-item layui-this" id="'+ el.menuId +'"><a href="javascript:void(0)"><i class="iconfont '+  el.menuStyle +'"></i> <p>'+ el.name +'</p></a></li>';
                        //初始化二级菜单
                        subMenu(el.menuId);
                    } else {
                        str+='<li class="layui-nav-item" id="'+ el.menuId +'"><a href="javascript:void(0)"><i class="iconfont '+  el.menuStyle +'"></i> <p>'+ el.name +'</p></a></li>';
                    }
                });
                $("#menu").html(str);

                //重新渲染菜单效果
                element.render('nav');
            }
        });

        //点击一级菜单
        $("#menu").on('click', 'li', function() {
            subMenu($(this).attr('id'));
            //如果二级左侧菜单是折叠的，则展开
            if($(".menu-fold").hasClass('show')){
                fold($(".menu-fold"))
            }
        });

        //二级左侧菜单折叠效果
        $(".menu-fold").on('click', function(event) {
            fold($(this))
        })

        //二级菜单
        function subMenu(menuId){
            $.ajax({
                url: ctxPath + 'getMenuDetail?menuId='+ menuId,
                type: 'post',
                success: function(data){
                    var zNodes = [];
                    $.each(data, function(index, el) {
                        el.iconSkin = 'iconfont '+ el.menuStyle + ' ';
                        zNodes.push(el)
                    });

                    var setting = {
                        view: {
                            dblClickExpand: false,
                            showLine: false,
                            showTitle: false
                        },
                        data: {
                            simpleData: {
                                enable: true,
                                idKey: 'menuId',
                                pIdKey: 'pid'
                            }
                        },
                        callback: {
                            onClick:chooseNode
                        }
                    };

                    //选择节点
                    function chooseNode(event, treeId, treeNode){
                        var zTree = $.fn.zTree.getZTreeObj("tree");
                        zTree.expandNode(treeNode);

                        //获取一二三级菜单名称，存储session
                        if(treeNode.getParentNode() != null){
                            var parentName = treeNode.getParentNode().name
                        }
                        var thisName = treeNode.name;
                        var parentsName = $("#menu li.layui-this").find("p").text();
                        sessionStorage.setItem("nav", JSON.stringify({parentsName:parentsName, parentName:parentName, thisName:thisName}));

                        if(treeNode.urlRequest != '/'){
                            $(".layadmin-iframe").attr("src", treeNode.urlRequest);
                        }
                    }

                    $(document).ready(function(){
                        $.fn.zTree.init($("#tree"), setting, zNodes);
                    });

                }
            });
        };

        form.verify({
            confirmPass:function(value){
                if($('input[name=pwd]').val() != value)
                    return '两次密码输入不一致！';
            }
        });

        form.on('submit(changePwd)', function(data){
            $.ajax({
                type : "post",
                url : ctxPath + 'savePwd',
                data : data.field,
                success : function(result) {
                    if (result) {
                        layer.msg("修改密码成功！", {
                            icon : 1,
                            time : 2000
                        }, function() {
                            layer.close(indexo);
                        });
                    } else {
                        layer.msg("修改密码失败！", {
                            icon : 2,
                            anim : 6,
                            time : 2000
                        });
                    }
                },
                error : function() {
                    layer.msg("修改密码失败！", {
                        icon : 2,
                        anim : 6,
                        time : 2000
                    });
                }
            });
            return false;
        });
    }();

    function to_index() {
        $(".layadmin-iframe").attr("src", ctxPath + 'img/welcome.png');
    }

    // 修改密码
    function do_change_password() {
        layer.open({
            type: 1
            ,title: '修改密码'
            ,content: $('#pwdForm')
            ,btn: ['保存', '关闭']
            ,area : [ '500px', '400px' ]
            ,yes : function(index, layero) {
                indexo = index;
                layero.find("form [lay-submit]")[0].click();
                return false;
            }
            ,end : function() {
                $("#pwd").val('');
                $("#pwd1").val('');
                $("#pwdForm").hide();
            }
        });
    }
</script>
</html>